<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>InstancedFlow - Three.js Docs</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	<script src="../scripts/highlight.min.js"></script>
	<link type="text/css" rel="stylesheet" href="../styles/highlight-three.css">
	<link type="text/css" rel="stylesheet" href="../styles/page.css">
</head>
<body>
		<p class="inheritance" translate="no"><a href="Flow.html">Flow</a> → </p>
	<h1 translate="no">InstancedFlow</h1>
		<section>
			<header>
				<div class="class-description"><p>An instanced version of <a href="Flow.html">Flow</a> for making meshes bend around curves, where the instances are placed on the curve.</p>
<p>This module can only be used with <a href="WebGLRenderer.html">WebGLRenderer</a>.</p></div>
			</header>
			<article>
				<h2 class="subsection-title">Import</h2>
				<p><span translate="no">InstancedFlow</span> is an addon, and must be imported explicitly, see <a href="https://threejs.org/manual/#en/installation" target="_blank" rel="noopener">Installation#Addons</a>.</p>
				<pre><code class="language-js">import { InstancedFlow } from 'three/addons/modifiers/CurveModifier.js';</code></pre>
				<div class="container-overview">
					<h2>Constructor</h2>
					<h3 class="name name-method" id="InstancedFlow" translate="no">new <a href="#InstancedFlow">InstancedFlow</a><span class="signature">( count : <span class="param-type">number</span>, curveCount : <span class="param-type">number</span>, geometry : <span class="param-type">Geometry</span>, material : <span class="param-type"><a href="Material.html">Material</a></span> )</span> </h3>
					<div class="method">
						<div class="description">
							<p>Constructs a new InstancedFlow instance.</p>
						</div>
						<table class="params">
							<tbody>
								<tr>
									<td class="name">
										<strong>count</strong>
									</td>
									<td class="description last">
										<p>The number of instanced elements.</p>
									</td>
								</tr>
								<tr>
									<td class="name">
										<strong>curveCount</strong>
									</td>
									<td class="description last">
										<p>The number of curves to preallocate for.</p>
									</td>
								</tr>
								<tr>
									<td class="name">
										<strong>geometry</strong>
									</td>
									<td class="description last">
										<p>The geometry to use for the instanced mesh.</p>
									</td>
								</tr>
								<tr>
									<td class="name">
										<strong>material</strong>
									</td>
									<td class="description last">
										<p>The material to use for the instanced mesh.</p>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				<h2 class="subsection-title">Classes</h2>
				<dl>
					<dt><a href="InstancedFlow.html">InstancedFlow</a></dt>
					<dd></dd>
				</dl>
				<h2 class="subsection-title">Methods</h2>
					<h3 class="name name-method" id="moveIndividualAlongCurve" translate="no">.<a href="#moveIndividualAlongCurve">moveIndividualAlongCurve</a><span class="signature">( index : <span class="param-type">number</span>, offset : <span class="param-type">number</span> )</span> </h3>
					<div class="method">
						<div class="description">
							<p>Move an individual element along the curve by a specific amount.</p>
						</div>
						<table class="params">
							<tbody>
								<tr>
									<td class="name">
										<strong>index</strong>
									</td>
									<td class="description last">
										<p>Which element to update.</p>
									</td>
								</tr>
								<tr>
									<td class="name">
										<strong>offset</strong>
									</td>
									<td class="description last">
										<p>The offset.</p>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<h3 class="name name-method" id="setCurve" translate="no">.<a href="#setCurve">setCurve</a><span class="signature">( index : <span class="param-type">number</span>, curveNo : <span class="param-type">number</span> )</span> </h3>
					<div class="method">
						<div class="description">
							<p>Select which curve to use for an element.</p>
						</div>
						<table class="params">
							<tbody>
								<tr>
									<td class="name">
										<strong>index</strong>
									</td>
									<td class="description last">
										<p>The index of the instanced element to update.</p>
									</td>
								</tr>
								<tr>
									<td class="name">
										<strong>curveNo</strong>
									</td>
									<td class="description last">
										<p>The index of the curve it should use.</p>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<h3 class="name name-method" id="writeChanges" translate="no">.<a href="#writeChanges">writeChanges</a><span class="signature">( index : <span class="param-type">number</span> )</span> </h3>
					<div class="method">
						<div class="description">
							<p>The extra information about which curve and curve position is stored in the translation components of the matrix for the instanced objects
This writes that information to the matrix and marks it as needing update.</p>
						</div>
						<table class="params">
							<tbody>
								<tr>
									<td class="name">
										<strong>index</strong>
									</td>
									<td class="description last">
										<p>The index of tge instanced element to update.</p>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
				<h2 class="subsection-title">Source</h2>
				<p>
					<a href="https://github.com/mrdoob/three.js/blob/master/examples/jsm/modifiers/CurveModifier.js" translate="no" target="_blank" rel="noopener">examples/jsm/modifiers/CurveModifier.js</a>
				</p>
			</article>
		</section>
<script src="../scripts/linenumber.js"></script>
<script src="../scripts/page.js"></script>
</body>
</html>